import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:industry_net/base/common/util.dart';
import 'package:industry_net/base/component/component.dart';
import 'package:industry_net/pages/msg/chat/chat/index.dart';

class ChatBar extends StatelessWidget {
  ChatBar({Key? key}) : super(key: key);
  final controller = Get.find<ChatController>();
  final state = Get.find<ChatController>().state;
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 6.h),
      decoration: const BoxDecoration(
        color: ColorsUtil.bg,
      ),
      child: Column(
        children: [
          Container(
            color: ColorsUtil.separator,
            height: 1,
            margin: EdgeInsets.only(bottom: 8.r),
          ),
          Row(
            children: [
              _createIconBtn(
                  callback: controller.actionVoice,
                  iconData: Icons.keyboard_voice_outlined),
              Expanded(
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(5.r),
                  child: TextField(
                    controller: state.chatBarController,
                    focusNode: state.focusNode,
                    toolbarOptions: const ToolbarOptions(
                        copy: true, cut: true, paste: true, selectAll: true),
                    maxLines: 4,
                    minLines: 1,
                    decoration: InputDecoration(
                      fillColor: ColorsUtil.white,
                      filled: true,
                      border: InputBorder.none,
                      contentPadding:
                          EdgeInsets.symmetric(horizontal: 10.r, vertical: 8.r),
                    ),
                  ),
                ),
              ),
              _createIconBtn(
                  callback: controller.actionEmjoi,
                  iconData: Icons.emoji_emotions_outlined),
              Visibility(
                visible: !controller.state.isTextEditing,
                child: _createIconBtn(
                    callback: controller.actionAdd,
                    iconData: Icons.add_circle_outline),
              ),
              Visibility(
                visible: controller.state.isTextEditing,
                child: InkWell(
                  onTap: controller.actionSend,
                  child: Container(
                    margin: EdgeInsets.only(right: gap12),
                    padding:
                        EdgeInsets.symmetric(horizontal: 10.r, vertical: 5.r),
                    decoration: BoxDecoration(
                        color: ColorsUtil.green,
                        borderRadius: BorderRadius.circular(4.r)),
                    child: Text(
                      '发送',
                      style: pfMediumStyle(
                          color: ColorsUtil.white, fontSize: font12),
                    ),
                  ),
                ),
              ),
            ],
          ),
          Visibility(
            visible: state.isAdding,
            child: _createAddInputView(),
          ),
        ],
      ),
    );
  }

  Widget _createAddInputView() {
    var _itemSize = 50.r;
    var _spacing = (Get.width - (_itemSize * 4) - (60.r)) / 3;
    return Container(
      height: 256.r,
      alignment: Alignment.topLeft,
      padding: EdgeInsets.symmetric(horizontal: 30.r, vertical: 30.r),
      child: Wrap(
        spacing: _spacing,
        runSpacing: 20.r,
        children: state.inputItems
            .map(
              (e) => MenuItemView(
                icon: Container(
                  width: _itemSize,
                  height: _itemSize,
                  padding: EdgeInsets.all(10.r),
                  decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(5.r)),
                  child: loadImage(url: e.url, fit: BoxFit.contain),
                ),
                title: Text(
                  e.name,
                  style:
                      pfMediumStyle(color: ColorsUtil.title, fontSize: font13),
                ),
              ),
            )
            .toList(),
      ),
    );
  }

  Widget _createIconBtn({required IconData iconData, VoidCallback? callback}) {
    return InkWell(
      onTap: callback,
      child: SizedBox(
        width: 40.r,
        child: Icon(
          iconData,
          color: const Color(0xff333333),
          size: 24.r,
        ),
      ),
    );
  }
}
